<template>
  <div>
    <!-- 搜索表单 -->

    <!-- 表格 -->
    <el-table border :data="books">
      <el-table-column label="选择">
        <template slot-scope="scope">
          <!-- label：勾选这一项时，得到的数据有哪些，现在我把这一条记录中所有的字段都做为值 -->
          <el-radio v-model="chkData" :label="scope.row">
            <span style="color: #fff">.</span>
          </el-radio>
        </template>
      </el-table-column>
      <el-table-column label="图片名称" prop="name">
      </el-table-column>
    </el-table>
    <!-- 翻页 -->
  </div>
</template>

<script>
import axios from 'axios'
export default {
  name: 'Book',
  data() {
    return {
      form: {
        page: 1,
        limit: 10,
        name: '',
        book_classify_id: '',
        status: 1, // 只查询上架的图书
        spell_group: 1,
        integral_shop: 0,
        recommend: 0
      },
      books: [],
      chkData: {} // 勾选的图书
    }
  },
  watch: {
    chkData: function(newValue) {
      // 把最新的值传给父组件
      this.$emit('books', newValue)
    }
  },
  created() {
    // 获取图片
    axios.get('/books', {
      params: this.form
    }).then(res => {
      if (res) {
        this.books = res.data.list
      }
    })
  }
}
</script>
